<template>
	<div class="list-page">
		<tool-bar nav="" title="菜单">
			<el-button @click="flyway_click">重新执行flyway</el-button>
			<el-button @click="$data.add_dlg=true;$data.pNode={};$data.node={};">添加</el-button>
		</tool-bar>

		<el-dialog v-model="$data.add_dlg" title="添加菜单">
			<menu-card-com v-model="$data.node" :pNode="$data.pNode" v-if="$data.add_dlg" @done="it=> { $data.add_dlg=false;loadData(); }"/>
		</el-dialog>



		<my-list
			ref="list"
			url="/admin/admin-menu/list"
			@param="preload"
			@loaded="procData"
			:page-size="10"
			row-key="id"
			default-expand-all
            :tree-props="{children: 'menus',hasChildren: 'hasChildren'}"
		>
			<el-table-column label="菜单名称" align="left" class-name="cell-flex" width="240" >
				<template v-slot="scope">
					<div class="link" @click="edit_click(scope.row)">{{ scope.row.name }}</div>
				</template>
			</el-table-column>
			<el-table-column align="left" label="菜单链接" prop="url" min-width="240"></el-table-column>
			<el-table-column align="left" label="code" prop="code" min-width="80"></el-table-column>
			<el-table-column align="center" label="排序" prop="sort" width="80"></el-table-column>
			<el-table-column label="操作" align="center" width="220">
				<template v-slot="scope">
					<el-button @click="$data.add_dlg=true;$data.pNode=scope.row;$data.node={};" size="small" round>
						添加子菜单
					</el-button>
					<el-button type="warning" plain round @click="delete_click(scope.row)" size="small">
						删除
					</el-button>
				</template>
			</el-table-column>
			<template #query="scope">
				<kv label="名称">
					<el-input v-model="scope.query.name"></el-input>
				</kv>
			</template>
		</my-list>
	</div>
</template>

<script setup>
/**
 * Created by CodeGenerator at 2021-03-14 15:58:11
 */
import menuCardCom from "./admin-menu-card.vue"



//定义 vue2的this,当前组件
const $self = getCurrentInstance();

//定义 $attrs
const $attrs = useAttrs()

//定义属性
const $props = defineProps({
    id: { type: String },
    action: { type: String }
});




const $model = defineModel({ type: String });

//定义data
const $data = reactive({
    add_dlg: false,
    pNode: {},
    node: {},
    tableData: {}
});


const preload = function (param) {
    //添加查询参数，修改分页参数等。
    //param.type = jv.$route.params.type
}
//处理列表的数据

const procData  = function (res) {

    $data.tableData = res.data;
}
const list = ref();
//查询
const loadData = function (pageNumber) {
    list.value.loadData(pageNumber);
}


const getPNode = function (row) {
  var pNode = {};
  jv.recursionJson($data.tableData.data, (json, parent) => {
    if (json.id == row.id) {
      if (parent && parent.id) {
        pNode = {id: parent.id, name: parent.name};
      }
      return false;
    }
  });
  return pNode;
}

const edit_click = function (row) {
    // this.$refs.list.setCurrentRow(row);
    //记录上次点击行
    var rowId = row.id;

    $data.pNode = getPNode(row);
    $data.node = JSON.clone(row);
    $data.add_dlg = true;
}

const delete_click = function (row) {
    var rowId = row.id;
    var rowName = row.name;
    jv.confirm('确认删除 ' + rowName + ' 吗？').then(res => {
        jv.$http.post("/admin/admin-menu/delete/" + rowId).then(res => {
            //[axios拦截器中已处理了异常]。
            loadData();
        })
    });
}
const set_click = function (row) {
    //设置事件
    var rowId = row.id;
}

const flyway_click = function() {
    jv.$http.post("/ops/flyway/mongo/replay").then(res => {
        jv.info("已重新执行 flyway")
    })
}
</script>
